<template>
  <div class="root">
    <div class='chengbao' @click="goPath('chengbao')">
      <img class="img_icon" src='~@/assets/home/cb.png'>
    </div>
    <div class='youxiaoxianjie' @click="goPath('youxiao')">
        <img class="img_icon" src='~@/assets/home/yxxj.png'>
    </div>
    <div class='magic' @click="goPath('magic')">
      <img class="img_icon" src='~@/assets/home/mfjs.png'>
    </div>
    <div class='chuantongwenhua' @click="goPath('chuantongwenhua')">
        <img class="img_icon" src='~@/assets/home/ctwh.png'>
    </div>
    <div class='online_english' v-show="!clicked" @click="open_online_english()">
        <img class="img_icon" src='~@/assets/home/fxyy.png'>
    </div>
    <div class='online_english' v-show="clicked">
        <img class="img_icon" src='~@/assets/home/fxyy.png'>
    </div>
  </div>
</template>

<script>
  export default {
    data () {
      return {
        clicked: false
      }
    },
    methods: {
      goPath: function (namePath) {
        // console.log('check')
        if (this.$store.state.active) {
          this.$router.push({ name: namePath })
        } else {
          alert('授权失败')
        }
      },
      open_online_english () {
        this.clicked = true
        setTimeout(() => {
          this.clicked = false
        }, 5000)
        let childProcessOpenOnlineEnglish = require('child_process')
        childProcessOpenOnlineEnglish.exec('start /max DeweyLive.exe', {cwd: 'resources/dewey-live/'}, (error, stdout, stderr) => {
          if (error) {
            console.log(error)
          } else {
            console.log('open success')
          }
        })
      }
    }
  }
</script>

<style scoped>
.root {
  height: 100%;
  width: 100%;
}
.root > div {
  position: absolute;
}
.chengbao {
  left: 590px;
  top: 135px;
  width: 180px;
  height: 151px;
}
.youxiaoxianjie {
  left: 400px;
  top: 330px;
  width: 160px;
  height: 194px;
}
.magic {
  left: 250px;
  top: 80px;
  width: 165px;
  height: 188px;
}
.chuantongwenhua {
  left: 845px;
  top: 330px;
  width: 205px;
  height: 175px;
}
/* .womeng {
  left: 698px;
  top: 348px;
} */
.online_english {
  left: 905px;
  top: 85px;
  width: 200px;
  height: 176px;
}
</style>
